<template>
	<view class="chooseU" @click="listShow = false">
		<view class="univer-tabs">
			<u-tabs-swiper ref="uTabs" :list="list" :current="current" @change="tabsChange" :is-scroll="false"
				active-color="#20b86f" swiperWidth="750"></u-tabs-swiper>
		</view>
		<view class="swiper-item" v-show="current == 0">
			<view class="univer-text1">我想知道我是否能被大学录取</view>
			<view class="swiper-item-text">
				<view class="swiper-item-label item-label1">录取批次：</view>
				<view class="swiper-item-input1" @click="batchShow = true">
					{{batchType}} <u-icon name="arrow-down" class="icon"></u-icon>
				</view>
			</view>
			<view class="swiper-item-text">
				<view class="swiper-item-label">学校名称：</view>
				<view class="swiper-item-input1">
					<u-input v-model="batchObj.title_key" @input="changeSchool" @blur="inputBlur" :clearable="false" placeholder='请输入关键词' />
					<view v-if="schoolList.length>0">
						<view class="school-list" v-show="listShow" @click.stop="aa">
							<view v-for="(item,i) in schoolList" :key="i" @click="chooseSchool(item)">{{item.title}}</view>
						</view>
					</view>
				</view>
			</view>
			<view class="basic-btn" @click="get_search_school()">
				马上查询
			</view>
			
			<u-select v-model="batchShow" :list="batchList" @confirm="confirmBatch" confirm-color="#20b86f"></u-select>
		</view>
		<view class="swiper-item1" v-show="current == 1">
			<view class="">我对院校所在地、层次、类型、公办民办有具体要求</view>
			<view class="item1-title1">分析方式</view>
			<view class="item1-radio">
				<view>
					<u-radio-group v-model="analysis">
						<u-radio :name="item.type" @change="radioChange" :disabled="false" v-for="(item,i) in analyze_type_list" :key='i'>
							{{item.name}}
						</u-radio>
					</u-radio-group>
				</view>
			</view>
			<view class="item1-title1">往年数据</view>
			<view class="item1-radio">
				<view>
					<u-radio-group v-model="oldData">
						<u-radio :name="item" @change="radioChangeData" :disabled="false" v-for="(item,i) in recruiting_year" :key='i'>
							{{item}}
						</u-radio>
					</u-radio-group>
				</view>
			</view>
			<view class="item-input">
				筛选范围：
				<view class="item-input1">
					<u-input v-model="screen_fraction" :clearable="false" placeholder='请输入数值' />
				</view>
				<view class="item-input1-notes">举例：如果你的总分是500，输入30，系统会筛选出当年该批次录取平均值在470—530分范围的结果。</view>
			</view>
			<view class="item1-group">
				<view class="swiper-item-text">
					<view class="swiper-item-label">录取批次：</view>
					<view class="swiper-item-input1" @click="batchShow = true">
						{{batch_type_label}} <u-icon name="arrow-down" class="icon"></u-icon>
					</view>
				</view>
				<view class="swiper-item-text">
					<view class="swiper-item-label">院校层次：</view>
					<view class="swiper-item-input1" @click="schoolShow = true">
						{{level_type_label}} <u-icon name="arrow-down" class="icon"></u-icon>
					</view>
				</view>
				<view class="swiper-item-text">
					<view class="swiper-item-label">院校类别：</view>
					<view class="swiper-item-input1" @click="typeShow = true">
						{{school_type_label}} <u-icon name="arrow-down" class="icon"></u-icon>
					</view>
				</view>
			</view>
			<view class="item1-title1">院校所在地选择</view>
			<view class="major-area">
				<view>
					<view :class="['major-area-item',area_list?'':'major-area-item-active']" @click="allCity">
						全国
					</view>
					<u-icon name="play-right-fill" class="play-right-fill" color="#ffffff"></u-icon>
				</view>
				<view v-for="(item,i) in region_area_list" :key="i">
					<view>
						<view :class="['major-area-item',item.isChose?'major-area-item-active':'']" @click="confirm4(item)">
							{{item.name}}
						</view>
						<u-icon name="play-right-fill" class="play-right-fill" color="#999999" @click="changeShow(item)"></u-icon>
					</view>
					<view class="city-list" v-if="item.isShow">
						<view :class="[el.isChose?'city-active':'']" v-for="(el,index) in item.child_list" :key="index" @click="chooseCity(el,item)">{{el.province_str}}</view>
					</view>
				</view>
			</view>
			
			<u-select v-model="batchShow" :list="batchList" @confirm="confirm1" confirm-color="#20b86f"></u-select>
			<u-select v-model="schoolShow" :list="level_type_list" @confirm="confirm2" confirm-color="#20b86f"></u-select>
			<u-select v-model="typeShow" :list="feature_type_list" @confirm="confirm3" confirm-color="#20b86f"></u-select>
			<view class="basic-btn" @click="fuzzy_list">
				马上查询
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
					name: '精准查询'
				}, {
					name: '模糊查询'
				}],
				current: 0, // tabs组件的current值，表示当前活动的tab选项
				batchShow: false,
				schoolShow: false,
				typeShow: false,
				batchType: '',
				batchList: [],
				analyze_type_list: [],
				recruiting_year: [],
				region_area_list: [],
				area_list: "",
				level_type_list: [
					{
						value: '',
						label: '全部'
					}
				],
				feature_type_list: [
					{
						value: '',
						label: '全部'
					}
				],
				analysis: '',
				oldData: '',
				screen_fraction: '',
				batchObj: {
					batch_type: '',
					title_key: '',
				},
				batch_type_label: '全部',
				level_type_label: '全部',
				school_type_label: '全部',
				batch_type: '',
				level_type: '',
				school_type: '',
				listShow: false,
				schoolList: [],
				chooseitem: '',
				cityArr: []
			}
		},
		onLoad() {
			this.getpici();
		},
		methods: {
			aa() {
				
			},
			goto(name,item) {
				uni.navigateTo({
					url: name+"?school_code="+item.code+"&school_batch="+item.school_batch+"&school_batch_type="+item.school_batch
				});
			},
			// 查询学校
			changeSchool(e) {
				this.schoolList = [{title: '加载中'}]
				this.listShow = true;
				this.http({
					url: `api/v1/school_list/get_search_school`,
					data: {
						analyze_type: 1,
						batch_type: this.batchObj.batch_type,
						condition_type: 1,
						feature_type: 0,
						level_type: 0,
						school_code: "",
						school_type: 0,
						screen_fraction: "",
						title_key: e,
						year: 2019
					},
					method: 'POST',
					success: res => {
						this.schoolList = [];
						if(res.errcode == 0) {
							if(res.result instanceof Array) {
								this.listShow = false;
							}else {
								if(res.result.list.length > 0) {
									this.schoolList = res.result.list;
									this.listShow = true;
								}else {
									this.listShow = false;
								}
							}
						}else {
							this.listShow = false;
						}
					},
				})
			},
			inputBlur() {
				if(this.schoolList.length>0) {
					this.batchObj.title_key = this.schoolList[0].title;
					this.chooseitem = this.schoolList[0];
				}else {
					this.batchObj.title_key = ''
					this.chooseitem = ''
				}
				this.listShow = false;
			},
			// 选择学校
			chooseSchool(item) {
				this.batchObj.title_key = item.title;
				this.chooseitem = item;
				this.listShow = false;
			},
			// 院校批次
			confirm1(e) {
				this.batch_type = e[0].value;
				this.batch_type_label = e[0].label;
			},
			confirm2(e) {
				this.level_type = e[0].value;
				this.level_type_label = e[0].label;
			},
			confirm3(e) {
				this.school_type = e[0].value;
				this.school_type_label = e[0].label;
			},
			confirm4(item) {
				item.isChose = !item.isChose;
				if(item.isChose) {
					this.area_list = item.type;
					for(let s of item.child_list) {
						s.isChose = true;
						this.cityArr.push(s.id);
					}
				}else {
					for(let s of item.child_list) {
						s.isChose = false;
						this.cityArr.push(s.id);
					}
				}
				let has = false;
				for(let s of this.region_area_list) {
					for(let el of s.child_list) {
						if(el.isChose) {
							has = true;
						}
					}
				}
				if(!has) {
					this.area_list = '';
				}
			},
			allCity(){
				this.area_list = '';
				for(let s of this.region_area_list) {
					s.isChose = false;
					s.isShow = false;
					for(let el of s.child_list) {
						el.isChose = false;
					}
				}
			},
			changeShow(item) {
				item.isShow = !item.isShow;
			},
			chooseCity(el,item) {
				el.isChose = !el.isChose;
				let has = false;
				for(let s of item.child_list) {
					if(s.isChose) {
						has = true;
					}
				}
				if(has) {
					item.isChose = true;
				}else {
					item.isChose = false;
				}
			},
			// tabs通知swiper切换
			tabsChange(index) {
				this.current = index;
			},
			// 注意返回值为一个数组，单列时取数组的第一个元素即可(只有一个元素)
			confirmBatch(e) {
				if(e[0].value !== this.batchObj.batch_type) {
					this.batchType = e[0].label;
					this.batchObj.batch_type = e[0].value;
					this.batchObj.title_key = '';
					this.chooseitem = '';
				}else {
					this.batchObj.batch_type = e[0].value;
					this.batchType = e[0].label;
				}
			},
			// 选中任一radio时，由radio-group触发
			radioChange(e) {
				this.analysis = e;
			},
			radioChangeData(e) {
				console.log(e);
			},
			// 获取批次
			getpici() {
				this.http({
					url: `api/v1/choose_school/condition_search?condition_type=1`,
					method: 'GET',
					success: res => {
						uni.setStorageSync('condition',res.result);
						if(res.status == 1) {
							let b_list = [];
							// 总分判断是哪个档次
							let userInfo = uni.getStorageSync('userInfo');
							let allNum = userInfo.chinese + userInfo.english + userInfo.math + userInfo.synthesize;
							let type = 1;
							if(userInfo.subject_type == 2) {
								if(allNum>=500) {
									type = 3
								}else if(allNum>=381 && allNum<500) {
									type = 1
								}else if(allNum<381) {
									type = 5
								}
							}else if(userInfo.subject_type == 1) {
								if(allNum>=496) {
									type = 3
								}else if(allNum>=353 && allNum<496) {
									type = 1
								}else if(allNum<353) {
									type = 5
								}
							}
							
							this.region_area_list = [];
							for(let s of res.result.region_area_list) {
								s.isChose = false;
								s.isShow = false;
								for(let el of s.child_list) {
									el.isChose = false;
								}
								this.region_area_list.push(s)
							}
							
							// 录取批次
							if(res.result.batch_type_list) {
								res.result.batch_type_list.forEach((el,i)=>{
									if(el.type == type) {
										this.batchType = el.name;
										this.batchObj.batch_type = el.type;
										this.batch_type_label = el.name;
										this.batch_type = el.type;
									}
									b_list.push({
										value: el.type,
										label: el.name
									})
								})
							}
							// 院校层次
							let l_list = []
							if(res.result.level_type_list) {
								res.result.level_type_list.forEach(el=>{
									l_list.push({
										value: el.type,
										label: el.name
									})
								})
							}
							// 院校性质
							let f_list = []
							if(res.result.feature_type_list) {
								res.result.feature_type_list.forEach(el=>{
									f_list.push({
										value: el.type,
										label: el.name
									})
								})
							}
							this.batchList = b_list;
							this.analyze_type_list = res.result.analyze_type_list;
							this.analysis = res.result.analyze_type_list[0].type;
							this.recruiting_year = res.result.recruiting_year;
							this.oldData = res.result.recruiting_year[0];
							this.level_type_list = l_list;
							this.feature_type_list = f_list;
						}else{
							uni.showToast({
								title: res.info,
								icon: 'none'
							})
						}
					},
				})
			},
			isArr(o) {
				if ( typeof o == 'object' ){
					 if ( typeof o.length == 'number' ){
						 return 'Array' ;
					 } else {
						 return 'Object' ;   
					 }
				 } else {
					 return 'param is no object type' ;
				 }
			},
			// 精准查询
			get_search_school() {
				if(this.batchObj.title_key) {
					this.goto('../pages/universityDetail',this.chooseitem);
				}else {
					uni.showToast({
						title: "请选择学校",
						icon: 'none'
					})
				}
			},
			/* 模糊查询 */
			fuzzy_list() {
				let area_list = [];
				for(let item of this.region_area_list) {
					for(let el of item.child_list) {
						if(el.isChose) {
							area_list.push(el.province_code)
						}
					}
				}
				let obj = {
						"page": 1,
						"t_time": '',
						"analyze_type": this.analysis,
						"year": this.oldData,
						"batch_type": this.batch_type,
						"level_type": this.level_type,
						"school_type": this.school_type,
						"school_province_code": '',
						area_list: area_list.join(","),
						"screen_fraction": this.screen_fraction
					}
				uni.navigateTo({
					url: "../pages/searchResult?obj="+JSON.stringify(obj)
				});
			}
		}
	}
</script>

<style lang="less" scoped>
	.chooseU {
		min-height: 100vh;
	}
	.univer-tabs {
		margin: 0 80rpx;
	}
	.basic-btn {
		height: 80rpx;
		line-height: 80rpx;
		background-color: #00ca8a;
		color: #FFFFFF;
		text-align: center;
		margin: 60rpx 100rpx;
		border-radius: 100px;
	}
	.swiper-item {
		padding: 30rpx 120rpx;
		
		.univer-text1 {
			text-align: center;
		}
		.basic-text1 {
			color: #f90303;
			margin-top: 20rpx;
		}
		.swiper-item-label {
			display: inline-block;
			width: 160rpx;
			text-align: right;
		}
		.swiper-item-input1 {
			display: inline-block;
			width: calc(100% - 160rpx);
			border: 1px solid #f1f1f1;
			border-radius: 7px;
			padding: 0 10rpx;
			height: 74rpx;
			line-height: 74rpx;
			position: relative;
			.icon {
				float: right;
				margin-top: 20rpx;
				color: #999;
			}
			.school-list {
				position: absolute;
				left: 0;
				margin-top: 8rpx;
				width: 460rpx;
				background-color: #FFFFFF;
				border: 1px solid #e4e7ed;
				border-radius: 4px;
				box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
				padding: 10rpx 0;
				max-height: 800rpx;
				overflow-y: scroll;
				view {
					padding: 10rpx 0;
					padding-left: 12rpx;
					line-height: 1.2;
				}
				view:active {
					opacity: 0.6;
				}
			}
		}
		.swiper-item-text {
			margin-top: 30rpx;
		}
	}
	.swiper-item1 {
		padding: 20rpx 30rpx;
		.item1-title1 {
			text-align: center;
			margin: 20rpx;
		}
		.item1-radio {
			text-align: center;
			>view {
				display: inline-block;
			}
		}
		.item1-group {
			margin: 0 100rpx;
		}
		.item-input {
			text-align: center;
			margin-bottom: 30rpx;
			margin-top: 20rpx;
			.item-input1 {
				display: inline-block;
				width: 330rpx;
				border: 1px solid #f1f1f1;
				border-radius: 7px;
				padding-left: 10rpx;
				margin-left: 14rpx;
			}
			.item-input1-notes {
				font-size: 24rpx;
				color: #999999;
				text-align: left;
			}
		}
		.swiper-item-label {
			display: inline-block;
			width: 160rpx;
			text-align: right;
		}
		.swiper-item-input1 {
			display: inline-block;
			width: calc(100% - 160rpx);
			border: 1px solid #f1f1f1;
			border-radius: 7px;
			padding: 0 10rpx;
			height: 74rpx;
			line-height: 74rpx;
			color: #aaa;
			margin-bottom: 30rpx;
			.icon {
				float: right;
				margin-top: 20rpx;
				color: #aaa;
			}
		}
	}
	.item-label1 {
		float: left;
		margin-top: 16rpx;
	}
	.major-area {
		text-align: center;
		padding-top: 20rpx;
		.major-area-item {
			display: inline-block;
			width: 88%;
			border: 1px solid #bbbbbb;
			border-radius: 4px;
			line-height: 66rpx;
			margin-bottom: 16rpx;
		}
		.major-area-item-active {
			background-color: #40c682;
			color: #FFFFFF;
			border: 1px solid #40c682;
		}
		.play-right-fill {
			float: right;
			margin-top: 20rpx;
		}
		.city-list {
			view {
				display: inline-block;
				border: 1px solid #e5e5e5;
				border-radius: 8rpx;
				padding: 10rpx 20rpx;
				margin-right: 30rpx;
				margin-bottom: 20rpx;
			}
			.city-active {
				background-color: #45b688;
				border: 1px solid #45b688;
				color: #FFFFFF;
			}
		}
	}
</style>
